import React, { useState, useEffect } from 'react'
import './wechat.scss'
import SVG from 'components/SVG';
import QRcode from 'qrcode.react';
const loginBtnBg = require('assets/account/btn-bg@2x.png')
interface LoginProps {
    historyStep: string,
    setStep: (val: string) => any,
    // setPhone: (val: string) => any,
    setHistoryStep: (val: string) => any,
}
// console.log(QRCode);
function WeChatLogin(props: LoginProps) {
    const { historyStep,setStep,setHistoryStep } = props;
    const url = 'http://skilltree.cn/'
    return (
        <div className='wechat-box animate-route'>
            <p className='wechat-box-title' >解锁新技能,上天赋树</p>
            <div className='wechat-form'>
                <div onClick={()=>{
                    setStep(historyStep)
                }}>
                    <SVG xlinkHref='icon-fanhui' className='wechat-return' />
                </div>
                <p className='wechat-form-title'>
                    微信登录
                            </p>
                <div className='wechat-form-imgbox'>
                    <div className='wechat-img-box'>
                    <QRcode
                        className='wechat-img'
                        value={url}  //value参数为生成二维码的链接
                        fgColor="#000000"  //二维码的颜色
                    />

                    </div>
                </div>
                <div className='wechat-mode'>
                    <p>请使用微信二维码登陆 “天赋树”</p>
                </div>
            </div>
        </div>
    )
}

export default WeChatLogin
